<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="css/site.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
<script src="scripts/script.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<title>Booking History</title>
<style>
th {
	width: 100px;
}
</style>
</head>
<body>
	<div><%@include file="/WEB-INF/header.jsp"%></div>
	<div class="content-wrapper">
		<div id="body" style="background:;">
			<h1>Booking History</h1>
			<br> <b>Flights Purchased</b> <br>
			<br>
			<section>
				<table>
					<tbody>
						<c:forEach items="${bookings}" var="booking">
							<tr>
								<th colspan="3"><span>Booked on: <fmt:formatDate
											value="${booking.dateOfBooking}" pattern="MM/dd/yyyy" />
								</span></th>
								<th colspan="1"></th>
							</tr>
							<tr>
								<td>Flight date: <fmt:formatDate
											value="${booking.flight.departure}" pattern="MM/dd/yyyy" /></td>
							</tr>
							<tr>
								<td>Flight number: <c:out value="${booking.flight.id}" /></td>
							</tr>
							<tr>
								<td>From: <c:out value="${booking.flight.source}" /></td>
								<td>To: <c:out value="${booking.flight.destination}" /></td>
								<td>Flight time: <c:out
										value="${booking.flight.timeDifference}" /></td>
							</tr>
							<tr>
								<td colspan="2">Departure: <fmt:formatDate
										value="${booking.flight.departure}" pattern="hh:mm a" /></td>
								<td colspan="2">Arrival: <fmt:formatDate
										value="${booking.flight.arrival}" pattern="hh:mm a" /></td>
							</tr>
							<tr>
								<td colspan="2">
									<ul>
										<li>Operator: <c:out value="${booking.flight.operator}" /></li>
										<li>Seat Type: <c:out value="${booking.seatType}" /></li>
										<li>Passengers: <c:out value="${booking.numOfSeats}" /></li>
									</ul>
								</td>
								<td colspan="1">Total cost: $<c:out
										value="${booking.totalCost}" />
								</td>
							</tr>
						</c:forEach>
					</tbody>
				</table>
			</section>
			<c:url value="FlightSearchQuery.jsp" var="encodedURLSearch"></c:url> 
			<form name="Flight Search" method="post"
				action="${encodedURLSearch}">
				<input type="submit" name="FlightSearchQuery" value="Home"
					class="button">
			</form>
		</div>
	</div>
</body>
</html>